<template>
  <!--这个就是我们的内容这个是我们的导航栏 我们直接进行复用就行-->


    <div class="header-avatar">

      <el-avatar size="medium" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png">
      </el-avatar>
      <el-dropdown>
  <span class="el-dropdown-link">
    admin<i class="el-icon-arrow-down el-icon--right"></i>
  </span>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item>个人中心</el-dropdown-item>
          <el-dropdown-item>退出</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
      <el-link href="" target="_blank">网站</el-link>
      <el-link href="https://blog.csdn.net/SpongeBob_shouse?type=blog" target="_blank">csdn</el-link>
    </div>


</template>

<script>
  export default {
    name: "head"
  }
</script>

<style scoped>
  .header-avatar {
    float: right;
    width: 210px;
    display: flex;
    /*内容会被撑开*/
    justify-content: space-around;
    align-items: center;
  }
</style>
